﻿<%@ Page MasterPageFile="~/Site.Master" Language="C#" AutoEventWireup="true" CodeBehind="ShipRuleCity.aspx.cs" Inherits="RabbitManage.UI.ShipRuleCity" %>

<asp:Content runat="server" ID="BodyContent" ContentPlaceHolderID="MainContent">
    <form id="form1" action="/Action/ShipRuleCityAdd.aspx" method="POST">
        
        <h3>运费修改（市）:</h3>

        <script type="text/javascript">

            form1.onsubmit = function (e) {
                e.preventDefault();

                var data = [];
                var price = document.getElementById("inputBaseCost");
                var inputs = document.getElementsByName("city");
                for (var j = 0; j < inputs.length; j++) {
                    var input = inputs[j];
                    if (input.checked) {
                        var cost = {};
                        cost["Region"] = input.value;
                        cost["Cost"] = price.value;
                        data.push(cost);
                    }
                }
                
                var xhr = new XMLHttpRequest();
                xhr.open(form1.method, form1.action, true);
                xhr.setRequestHeader('Content-Type', 'application/json; charset=UTF-8');

                xhr.send(JSON.stringify(data));

                xhr.onloadend = function () {
                    // done
                    if (xhr.responseText == "true") {
                        window.location = "/UI/ShipRuleShow.aspx";
                    } else {
                        alert(xhr.responseText);
                    }
                };
            };
            
            function ShowCity(province) {
                
                var data = <%=Data%>;
                var cityList;
                for (var i = 0; i < data.length; i++) {
                    if (province == data[i].name) {
                        cityList = data[i].cityList;
                        break;
                    }
                }
                
                var container = document.getElementById("cities");
                while (container.childNodes[0]!=null) {
                    container.removeChild(container.childNodes[0]);
                }
                
                for (var j = 0; j < cityList.length; j++) {
                    var tr=document.createElement("tr");
                    var td=document.createElement("td");

                    var cb = document.createElement("input");
                    cb.setAttribute("type", "checkbox");
                    cb.setAttribute("name", "city");
                    cb.setAttribute("id", "cb" + cityList[j].name);
                    cb.setAttribute("value", cityList[j].name);
                    td.appendChild(cb);
                    
                    var lb = document.createElement("label");
                    var t = document.createTextNode(cityList[j].name);
                    lb.setAttribute("for", "cb" + cityList[j].name);
                    lb.appendChild(t);
                    td.appendChild(lb);

                    tr.appendChild(td);
                    container.appendChild(tr);
                }
            }
        </script>
        
        <div>
            点击省份名称，展开省内城市
        </div>
        <table>
            <tr>
                <td style="width: 100px">
                    <table>
                        <tr>
                            <td>省份</td>
                            <td>首重</td>
                        </tr>
                <asp:Repeater runat="server" ID="costRepeater" >
                    <ItemTemplate>
                        <tr>
                            <td style="width: 60px"><label title="<%#Eval("Key") %>" onclick="ShowCity('<%#Eval("Key") %>')" style="width: 80px"><%#Eval("Key") %></label></td>
                            <td><label style="width: 40px; text-align: right;" ><%#Eval("Value") %></label></td>
                        </tr>
                    </ItemTemplate>
                </asp:Repeater>
                    </table>
                </td>
                
                <td style="vertical-align: top; width: 200px;">
                    <table >
                        <tr>
                            <td>
                                城市：
                            </td>
                        </tr>

                        <tr>
                            <td>
                                <table style="vertical-align: top;" id="cities">
                        
                                </table>
                            </td>
                        </tr>
                        
                        
                    </table>
                    
                </td>
                
                <td style="vertical-align: top;">
                    <table style="vertical-align: top;" >
                        <tr>
                            <td>
                                运费：
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input type="text" id="inputBaseCost" name="BaseCost" style="width: 40px; text-align: right;"  />
                            </td>
                        </tr>
                        <tr>
                            <td>
                                <input type="submit" value="保存" />
                            </td>
                        </tr>
                    </table>
                </td>
            </tr>
        </table>
        
    </form>
    
</asp:Content>